import {StyleSheet, Platform, Dimensions} from 'react-native';
import px2dp from '../../utils/px2dp';
const width = Dimensions.get('window').width;
const height = Dimensions.get('window').height;
const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: 'rgb(248, 248, 248)',
  },
  filter_icon_container: {
    width: px2dp(36),
    height: px2dp(36),
    marginRight: px2dp(42),
  },
  banner: {
    height: px2dp(336),
    backgroundColor: 'yellow',
  },
  title: {
    paddingHorizontal: px2dp(25),
    paddingVertical: px2dp(13),
    backgroundColor: '#fff',
  },
  title_text: {
    fontSize: px2dp(30),
    color: '#333',
    fontWeight: 'bold',
    lineHeight: px2dp(42),
  },
  start_time: {
    width: px2dp(244),
    height: px2dp(36),
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: '#EB0029',
    borderRadius: px2dp(8),
    marginVertical: px2dp(7),
  },
  time_text: {
    fontWeight: 'bold',
    fontSize: px2dp(20),
    color: '#FEFEFE',
  },
  tag: {
    height: px2dp(100),
    backgroundColor: '#fff',
    flexDirection: 'row',
    alignItems: 'flex-end',
    justifyContent: 'space-between',
  },
  tag_title: {
    height: px2dp(89),
    justifyContent: 'center',
  },
  tag_title_text: {
    fontSize: px2dp(42),
    color: '#fff',
    marginLeft: px2dp(103),
  },
  remain: {
    height: px2dp(100),
    justifyContent: 'center',
    alignItems: 'center',
    marginRight: px2dp(40),
  },
  remain_title: {
    fontSize: px2dp(20),
    color: '#FE5141',
    fontWeight: 'bold',
    marginBottom: px2dp(10),
  },
  remain_time: {
    flexDirection: 'row',
    alignItems: 'center',
  },
  remain_unit: {
    fontWeight: 'bold',
    fontSize: px2dp(22),
    color: '#fff',
  },
  time_num: {
    width: px2dp(31),
    height: px2dp(31),
    backgroundColor: '#FE5141',
    borderRadius: px2dp(4),
    justifyContent: 'center',
    alignItems: 'center',
    marginHorizontal: px2dp(7),
  },
  time_num_text: {
    fontSize: px2dp(22),
    fontWeight: 'bold',
    color: '#fff',
  },
  money_time_rule: {
    paddingHorizontal: px2dp(24),
    backgroundColor: '#fff',
  },
  money_box: {
    flexDirection: 'row',
    alignItems: 'center',
    marginTop: px2dp(28),
    marginBottom: px2dp(20),
  },
  money_unit: {
    color: '#EB0029',
    fontSize: px2dp(28),
    fontWeight: 'bold',
    marginTop: px2dp(22),
  },
  money_text: {
    fontSize: px2dp(50),
    fontWeight: 'bold',
    color: '#EB0029',
    marginLeft: px2dp(12),
    marginRight: px2dp(16),
  },
  del_money: {
    marginTop: px2dp(22),
    fontSize: px2dp(24),
    color: '#999999',
    textDecorationLine: 'line-through',
  },
  rule_text: {
    fontSize: px2dp(28),
    color: '#333333',
    paddingBottom: px2dp(22),
    borderBottomWidth: 1,
    borderBottomColor: '#EEEEEE',
  },
  list_box: {
    marginTop: px2dp(21),
  },
  list: {
    flexDirection: 'row',
    alignItems: 'center',
    marginBottom: px2dp(21),
  },
  line: {
    width: px2dp(5),
    height: px2dp(16),
    borderRadius: px2dp(2),
    backgroundColor: '#EB0029',
    marginLeft: px2dp(6),
    marginRight: px2dp(17),
  },
  list_title: {
    fontSize: px2dp(24),
    color: '#333333',
    fontWeight: 'bold',
  },
  list_info: {
    fontSize: px2dp(22),
    color: '#333333',
    fontWeight: 'bold',
  },
  teacher_container: {
    margin: px2dp(24),
    backgroundColor: '#fff',
    flexDirection: 'row',
    alignItems: 'center',
    paddingHorizontal: px2dp(8),
    paddingVertical: px2dp(17),
  },
  cover: {
    width: px2dp(147),
    height: px2dp(182),
    backgroundColor: '#f7f7f7',
    marginRight: px2dp(30),
  },
  teacher_desc:{
    flex: 1,
  },
  name: {
    marginTop: px2dp(12),
    color: '#333333',
    fontSize: px2dp(30),
    fontWeight: 'bold',
  },
  star_list: {
    flexDirection: 'row',
    alignItems: 'center',
  },
  star: {
    width: px2dp(22),
    height: px2dp(22),
    marginRight: px2dp(11),
    marginVertical: px2dp(22),
  },
  teacher_info: {
    fontSize: px2dp(20),
    color: '#999999',
    lineHeight: px2dp(26),
  },
  teacher_title: {
    color: '#333333',
  },
  desc_container: {
    marginHorizontal: px2dp(24),
    backgroundColor: '#fff',
    marginBottom: px2dp(98),
  },
  tabs_container: {
    flexDirection: 'row',
    height: px2dp(68),
    borderBottomColor: '#EEEEEE',
    borderBottomWidth: px2dp(1),
  },
  tab_btn: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
  },
  btn_text: {
    color: '#333333',
    fontSize: px2dp(26),
  },
  btn_text_selected: {
    color: '#EB0029',
    fontWeight: 'bold',
  },
  selected: {
    width: px2dp(24),
    height: px2dp(5),
    backgroundColor: '#EB0029',
    borderRadius: px2dp(3),
    position: 'absolute',
    bottom: 0,
    left: '50%',
    marginLeft: px2dp(-12),
  },
  couse_desc: {
    paddingHorizontal: px2dp(16),
    paddingVertical: px2dp(25),
  },
  couse_desc_text: {
    fontSize: px2dp(24),
    color: '#333333',
    lineHeight: px2dp(34),
  },
  footer: {
    width: '100%',
    flex: 1,
    position: 'absolute',
    left: 0,
    bottom: px2dp(750) > 375 && Platform.OS === 'ios' ? px2dp(44) : 0,
    flexDirection: 'row',
    alignItems: 'center',
    justifyContent: 'space-between',
    height: px2dp(98),
    backgroundColor: '#fff',
    borderTopColor: '#EEEEEE',
    borderTopWidth: px2dp(1),
  },
  foot_money: {
    fontSize: px2dp(50),
    color: '#EB0029',
    fontWeight: 'bold',
    marginLeft: px2dp(40),
  },
  foot_money_text: {
    fontSize: px2dp(28),
    marginRight: px2dp(12),
  },
  foot_btn_right: {
    flexDirection: 'row',
    alignItems: 'center',
    marginRight: px2dp(34),
  },
  foot_car: {
    width: px2dp(44),
    height: px2dp(42),
    marginRight: px2dp(26),
  },
  foot_btn: {
    width: px2dp(158),
    height: px2dp(48),
    justifyContent: 'center',
    alignItems: 'center',
    borderRadius: px2dp(24),
    backgroundColor: '#EB0029',
    marginHorizontal: px2dp(10),
  },
  foot_btn_text: {
    fontSize: px2dp(26),
    color: '#fff',
    fontWeight: 'bold',
  },
  couse_list: {
    padding: px2dp(28),
  },
  list_text: {
    flexDirection: 'row',
    alignItems: 'center',
    marginBottom: px2dp(48),
  },
  list_num: {
    fontSize: px2dp(24),
    color: '#666666',
    marginRight: px2dp(30),
  },
  list_detail: {
    fontSize: px2dp(28),
    color: '#333333',
  },
  webview_container: {
    flex: 1,
    // height: px2dp(200),
    minHeight: px2dp(200),
    // overflow: 'scroll'
  },
});

export default styles;
